<h4>Top Photo Aanalysis protocol (EN)</h4>
<ol>
	<li>Blow a puff of smoke into the hive from below.</li>
	<li>After a minute, remove the lid and take first a high-resolution photo from the label of the hive and then of the topside. For the accuracy of the photo analysis, take care to include the entire top frame in the photo, and use a standard angle (35mm) (Figure 1).</li>
</ol>
<img style="width:100%;" src="/img/inspection-top-photo-analysis-explnation.jpg">
<p style="font-style: italic; text-align: center;">Figure 1. Correct position of hive top in photograph and potential mistakes to avoid.</p>
<hr>
<div class="row">
	<div class="col-xs-12 col-sm-6 col-md-4 col-lg-3">
		<div class="form-item">
            <label>{{ hive.name }}</label>
        	<div>
    			<div class="hive left">
	    			<p class="lid" style="width: {{hive.frames_tpa*13}}px;"></p>
	            	<p ng-repeat="(key, layer) in hive.layers | orderBy : '-type' " ng-if="layer.type != 'brood'" class="layer" ng-class="layer.type" style="background-color: {{hive.color}}; width: {{hive.frames_tpa*13}}px;">
	            		<span ng-repeat="f in rangeStep(1,hive.frames_tpa)" class="frame wax" ng-class="layer.type"></span>
	            	</p>
	            	<p ng-repeat="layer in rangeStep(1,hive.brood_layers_tpa)" class="layer brood" style="background-color: {{hive.color}}; width: {{hive.frames_tpa*13}}px;">
	            		<span ng-repeat="f in rangeStep(1,hive.frames_tpa)" class="frame wax"></span>
	            	</p>
	            	<p class="bottom" style="width: {{hive.frames_tpa*13}}px;"></p>
            	</div>
            </div>
    	</div>
	</div>
	<div class="col-xs-12 col-sm-4 col-md-6">
		<div class="row">
			<div class="col-xs-6">
				<div>
					<label>{{ lang.Hive_brood_layers }}</label>
					<div step="1" ng-disabled="false" min="0" max="5" ng-model="hive.brood_layers_tpa" ng-change="calculateTpaColonySize()" rn-stepper></div>
				</div>
				<div>
					<label>{{ lang.Hive_frames }}</label>
					<div step="1" ng-disabled="false" min="0" max="20" ng-model="hive.frames_tpa" ng-change="calculateTpaColonySize()" rn-stepper></div>
				</div>
			</div>
			
			<div class="col-xs-6">
				<div>
					<label>{{ lang.fr_width_cm }}</label>
					<p ng-if="!hive.fr_width_cm" style="color:red; font-weight: bold;">{{ lang.fr_width_cm }} N/A!</p>
					<p ng-if="hive.fr_width_cm">{{ hive.fr_width_cm }} cm</p>
				</div>
				<div>
					<label>{{ lang.fr_height_cm }}</label>
					<p ng-if="!hive.fr_height_cm" style="color:red; font-weight: bold;">{{ lang.fr_height_cm }} N/A!</p>
					<p ng-if="hive.fr_height_cm">{{ hive.fr_height_cm }} cm</p>
				</div>
			</div>
    	</div>
    </div>
    <div class="col-xs-12 col-sm-4 col-md-3">
		<label>Total colony size</label>
		<p style="font-size: 40px;">
			<span ng-if="colony_size">{{ colony_size }} bees</span>
			<span ng-if="!colony_size">-</span>
		</p>
    </div>
</div>
<hr>